<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel="stylesheet" href="/css/bootstrap.min.css">
    <link rel="stylesheet" href="/css/laypage.css">
    <script src="/js/jquery/jquery-1.8.3.js"></script>
    <script src="/js/jquery.validation/1.14.0/jquery.validate.min.js"></script>
    <script src="/js/jquery.validation/1.14.0/messages_zh.min.js"></script>
    <script src="/js/layer/layer.js" charset="utf-8"></script>
</head>
<body>
<script src="/js/webSocket.js"></script>
<div class="container">
    <form id="fileForm" enctype="multipart/form-data" class="form-group">
        <div id="fileDiv">
            <input type="hidden" name="caseId" value="${caseId}"/>
            <div class="form-group">
                选择文件:<input type="file" name="file" style="display: inline-block;"/>
            </div>
        </div>
        <div class="form-group">
            <input id="add" type="button" class="btn btn-info" value="继续添加"/>
        </div>
        <div class="form-group">
            <input id="uploadBtn" type="button" class="btn btn-primary" value="上传"/>
            <input type="button" id="cancelBtn" class="btn btn-warning" value="取消"/>
        </div>
    </form>
</div>
</body>
</html>
<script type="text/javascript">
    $("#add").click(function () {
        $("#fileDiv").append("<div class='form-group'>选择文件:<input type='file' style='display:inline-block' name='file' /><input class='cancelBtns' type='button' value='取消'/></div>");
    });
    $(function () {
        $(".cancelBtns").live("click", function () {
            $(this).parent("div").remove();
        });
    });
    $("#cancelBtn").click(function () {
        var index = parent.layer.getFrameIndex(window.name);
        parent.getCaseList();
        parent.layer.close(index);
    });
    var upload = function () {
        var formData = new FormData($("#fileForm")[0]);
        $.ajax({
            type: 'POST',
            contentType: false,
            processData: false,
            dataType: 'json',
            data: formData,
            url: '/case/upload',
            success: function (data) {
                console.log(data);
                if (data.flag) {
                    $("#cancelBtn").click();
                    parent.layer.msg("上传成功", {icon: 6});
                } else if (data.flag && data.failMsg != null) {
                    layer.msg("由于网络原因,上传失败", {icon: 5});
                } else if (data.flag == null && data.failMsg != null) {
                    layer.msg("未选中任何文件", {icon: 5});
                }
            }
        });
    };
    $("#uploadBtn").click(function () {
        upload();
    });
</script>